<template>
  <div class="record">
    <el-card class="list-form">
      <el-form ref="recordForm" inline :model="form">
        <el-form-item label="复制类型：" prop="Type">
          <el-select v-model="form.Type">
            <el-option label="全部" :value="-1" />
            <el-option label="链接复制" :value="0" />
            <el-option label="整店复制" :value="1" />
            <el-option label="授权搬家" :value="3" />
          </el-select>
        </el-form-item>

        <el-form-item label="复制状态：" prop="Status">
          <el-select v-model="form.Status">
            <el-option label="全部" :value="-1" />
            <el-option label="进行中" :value="0" />
            <el-option label="已完成" :value="1" />
          </el-select>
        </el-form-item>

        <el-button type="primary" @click="onSubmit">搜索</el-button>
        <el-button @click="resetForm">重置</el-button>

      </el-form>
    </el-card>
    <el-card class="list-table">
      <el-table border="">
        <el-table-column
          type="index"
          label="序号"
        />
        <el-table-column
          prop="source_shop_name"
          label="店铺名称"
        />
        <el-table-column
          prop="source_platform_name"
          label="来源"
        />
        <el-table-column
          prop="source_platform_name"
          label="平台"
        />
        <el-table-column
          prop="type"
          label="复制类型"
          :formatter="typeFormatter"
        />
        <el-table-column
          prop="total_count"
          label="总商品数"
        />
        <el-table-column
          prop="fail_count"
          label="失败数"
        />
        <el-table-column
          prop="created_at"
          label="提交时间"
        />
        <el-table-column
          prop="success_count"
          label="成功数"
        />
        <el-table-column
          prop="updated_at"
          label="更新时间"
        />
        <el-table-column
          prop="push_status"
          label="复制状态"
        />
        <el-table-column
          prop="remark"
          label="描述"
        />
        <el-table-column
          label="操作"
        />
      </el-table>
    </el-card>
  </div>
</template>

<script>
import { copyRecord } from '@/api/copy'
import { mapGetters } from 'vuex'

export default {
  data() {
    return {
      form: {
        Type: -1,
        Status: -1
      },
      PageIndex: 1,
      PageSize: 20
    }
  },
  computed: {
    ...mapGetters([
      'shopInfo'
    ])
  },
  methods: {
    typeFormatter(type) {
      const t = ['链接复制', '整店复制', '授权复制', '授权复制']
      return t[type]
    },
    onSubmit() {
      const { PageIndex, PageSize } = this
      const { platFormCode: PlatformCode, shopCode: ShopCode } = this.shopInfo
      copyRecord({
        PlatformCode,
        ShopCode,
        PageIndex,
        PageSize,
        ...this.form
      }).then(res => {
        console.log(res)
      })
    },
    resetForm() {
      this.$refs.recordForm.resetFields()
      this.PageIndex = 1
    }
  }
}
</script>

<style lang="scss" scoped>
.record {
  padding: 12px 20px 0;
  .list-form {
    border-radius: 4px;
  }
}
</style>
